class SingleValueRender {
  constructor(map) {
    this.map = map;
  }

  // pointSingleValueRender(options) {
  //   const { layerId, singleColor, layerOptions } = options
  //   const layout = layerOptions.layout
  //   const paint = layerOptions.paint
  //   Object.keys(layout).forEach(key => {
  //     this.map.setLayoutProperty(layerId, key, layout[key])
  //   })
  //   this.map.setPaintProperty(layerId, 'circle-color', singleColor)
  //   Object.keys(paint).forEach(key => {
  //     this.map.setPaintProperty(layerId, key, paint[key])
  //   })
  // }
  pointSingleValueRender(options) {
    const { layerId, layout, paint } = options;
    // 清空原先的图层属性
    const paintProps = this.map.getLayer(layerId).paint;
    Object.keys(paintProps).forEach((key) => {
      this.map.setPaintProperty(layerId, key, null);
    });
    Object.keys(layout).forEach((key) => {
      this.map.setLayoutProperty(layerId, key, layout[key]);
    });
    Object.keys(paint).forEach((key) => {
      // if (key === 'circle-stroke-opacity') {
      //   this.map.setPaintProperty(layerId, key, paint[key] / 100)
      // } else if (key === 'circle-opacity') {
      //   this.map.setPaintProperty(layerId, key, paint[key] / 100)
      // } else if (key === 'circle-blur') {
      //   this.map.setPaintProperty(layerId, key, paint[key] / 7)
      // } else {
      //   this.map.setPaintProperty(layerId, key, paint[key])
      // }
      this.map.setPaintProperty(layerId, key, paint[key]);
    });
  }

  // polygonSingleValueRender(options) {
  //   const layout = options.layerOptions.layout
  //   const paint = options.layerOptions.paint
  //   const layerId = options.layerId
  //   Object.keys(layout).forEach(key => {
  //     this.map.setLayoutProperty(layerId, key, layout[key])
  //   })
  //   this.map.setPaintProperty(layerId, 'fill-color', options.singleColor)
  //   Object.keys(paint).forEach(key => {
  //     this.map.setPaintProperty(layerId, key, paint[key])
  //   })
  // }
  polygonSingleValueRender(options) {
    const { layerId, layout, paint } = options;
    Object.keys(layout).forEach((key) => {
      this.map.setLayoutProperty(layerId, key, layout[key]);
    });
    Object.keys(paint).forEach((key) => {
      // if (key === 'fill-opacity') {
      //   this.map.setPaintProperty(layerId, key, paint[key] / 100)
      // } else {
      //   this.map.setPaintProperty(layerId, key, paint[key])
      // }
      this.map.setPaintProperty(layerId, key, paint[key]);
    });
  }

  // polylineSingleValueRender(options) {
  //   const { layerId, singleColor, layerOptions } = options
  //   const layout = layerOptions.layout
  //   const paint = layerOptions.paint
  //   Object.keys(layout).forEach(key => {
  //     this.map.setLayoutProperty(layerId, key, layout[key])
  //   })
  //   this.map.setPaintProperty(layerId, 'line-color', singleColor)
  //   Object.keys(paint).forEach(key => {
  //     this.map.setPaintProperty(layerId, key, paint[key])
  //   })
  // }
  polylineSingleValueRender(options) {
    const { layerId, layout, paint } = options;
    Object.keys(layout).forEach((key) => {
      this.map.setLayoutProperty(layerId, key, layout[key]);
    });
    Object.keys(paint).forEach((key) => {
      // if (key === 'line-opacity') {
      //   this.map.setPaintProperty(layerId, key, paint[key] / 100)
      // } else if (key === 'line-blur') {
      //   this.map.setPaintProperty(layerId, key, paint[key] * 1.5)
      // } else {
      //   this.map.setPaintProperty(layerId, key, paint[key])
      // }
      this.map.setPaintProperty(layerId, key, paint[key]);
    });
  }
  singleValueRenderEntry(options) {
    switch (options.layerType) {
      case 'circle': {
        return this.pointSingleValueRender(options);
      }
      case 'fill': {
        return this.polygonSingleValueRender(options);
      }
      case 'line': {
        return this.polylineSingleValueRender(options);
      }
    }
  }
}

export default SingleValueRender;

// const options = {
//   layerType: '',
//   layerId: '',
//   singleColor: '',
//   layerOptions: {
//     layout: {
//       visibility: 'none'
//     },
//     paint: {
//       'fill-opacity': 0.5,
//       'fill-outline-color': '#ff0000'
//     }
//   },
// }
